<%@ page contentType="text/html; charset=utf-8" language="java" import="java.sql.*" errorPage="" %>
<%@ taglib prefix="shiro"  uri="http://shiro.apache.org/tags"%>
<style>
	.scheduleBox{width:400px; height:auto}
</style>
<script>
$(function(){
	$('.date-picker').datepicker({
		autoclose: true,
		todayHighlight: true
	}).next().on(ace.click_event, function(){
		$(this).prev().focus();
	});
	
	var datatable = $("#CategoryTable").DataTable({
		"language":{
			"url": "${pageContext.request.contextPath}/resources/admin/assets/de_DE.txt"
		},
		"dom": '<"top"f>rt<"bottom" ip><"clear">',
		"lengthMenu": [10, 3, 20,30],
		"pagingType": "full_numbers",
		"order":[[2,'asc']],
		"filter": false,
		"processing": true,
		"serverSide": true,
		"ajax": {
            "url": "${pageContext.request.contextPath}/product/category/categoryList.do",
            "type": "post"
        },
		 "columns": [
		        {"data":"id","sortable":false,"render":function(data,type,row){
		        	return '<input type="checkbox" class="ace" value="'+row.id+'"/> <span class="lbl"></span>'
		        },"class":"center",width:"10"},
				{ "data": "name" },
				{"data": "seq",width:"100"},
				{ "data": "remark" },
				{ "data": null,orderable: false,"render":function(data,type,row){
					return   '<shiro:hasPermission name="product:category:edit"><a href="#" class="green" onclick="editCategory('+row.id+')"><i class="ace-icon fa fa-pencil"></i>编辑</a></shiro:hasPermission>'+ '&nbsp;&nbsp;<shiro:hasPermission name="product:category:del"><a href="#" class="red" onclick="delCategory('+row.id+')"><i class="ace-icon fa fa-trash-o "></i>删除</a></shiro:hasPermission>';
				},width:"100"} 
	        ]
	});
	
	$('#refreshUser').click(function(){
		datatable.draw();
	})
	
	$('#delCategory').click(function(){
		var selected = datatable.rows('.selected').data();
		alert( datatable.rows('.selected').data().length +' row(s) selected' );
	});

    $('#doSearch').click(function(){
        datatable.draw();
    });
	
	$(document).on('click', 'th input:checkbox' , function(){
		var that = this;
		$(this).closest('table').find('tr > td:first-child input:checkbox')
		.each(function(){
			//$(this).closest('tr').toggleClass('selected');
			this.checked = that.checked;
		});
	});
	
});

function editCategory(cateId){
	var url = "${pageContext.request.contextPath}/product/category/editCategoryPage";
	var dialog = art.dialog({
		id:'categoryEditDialog',
		lock:true
	});
	$.post(url,{id:cateId},function(data){
		dialog.content(data);
	});
}

function addCategory(){
	var url = "${pageContext.request.contextPath}/product/category/categoryAddPage";
	var dialog = art.dialog({
		id:'categoryAddDialog',
		lock:true,
		top:'40%'
	});
	$.post(url,function(data){
		dialog.content(data);
	});
}

function delCategory(cateId){
	var url = "${pageContext.request.contextPath}/product/category/categoryDel.do";
	$.post(url,{id:cateId},function(data){
		if(data.success){
			art.dialog({content:data.msg,resize:true,time:2,icon:'succeed',ok:function(){this.close()}});
			$('#CategoryTable').DataTable().draw() ;		//重新刷新数据表格
		}
	})
}

</script>
<div class="breadcrumbs">
	<script type="text/javascript">
		try{ace.settings.check('breadcrumbs' , 'fixed')}catch(e){}
	</script>
	<ul class="breadcrumb">
		<li>
			<i class="ace-icon fa fa-home home-icon"></i>
			<a href="#">首页</a>
		</li>
		<li class="active">产品类别管理</li>
	</ul><!-- /.breadcrumb -->
	
	<div class="nav-search" id="nav-search">
		<form class="form-search">
			<span class="input-icon">
				<input type="text" placeholder="Search ..." class="nav-search-input" id="nav-search-input" autocomplete="off" />
				<i class="ace-icon fa fa-search nav-search-icon"></i>
			</span>
		</form>
	</div><!-- /.nav-search -->
</div>
<div class="page-content">
	<div class="row">
		<div class="col-sm-12">
            <div class="widget-box widget-color-dark">
                <div class="widget-header">
                    <h5 class="widget-title">产品类别列表</h5>
                    <div class="widget-toolbar">
                        <shiro:hasPermission name="product:category:add">
                        <button class="btn btn-xs btn-round btn-purple bigger" onclick="addCategory()">
                            <i class="ace-icon fa fa-plus"></i>
                            新增
                        </button>
                        </shiro:hasPermission>
                        <button class="btn btn-xs btn-round btn-success bigger" id="refreshUser">
                            <i class="ace-icon fa fa-refresh"></i>
                            刷新
                        </button>
                    </div>
                </div>
                <div class="widget-body">

                    <div class="widget-main padding-6">
                        <table class="table table-striped table-hover row-border cell-border" id="CategoryTable">
                            <thead>
                            <tr>
                                <th class="center">
                                    <input type="checkbox" class="ace"/> <span class="lbl"></span>
                                </th>
                                <th>名称</th>
                                <th>显示顺序</th>
                                <th>备注</th>
                                <th>操作</th>
                            </tr>
                            </thead>
                        </table>

                    </div>
                </div>

            </div>

		</div>
	</div>
</div>